<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="../css/reset.css" />
		<style type="text/css">
			body {
				background-color: #dfdfdd;
			}
			/*设置ul的样式*/
			
			.img-list {
				/*设置ul的宽度*/
				width: 240px;
				height: 580px;
				margin: 50px auto;
				/*裁剪溢出部分*/
				overflow: hidden;
				background-color: #f4f4f4;
			}
			/*设置li的位置*/
			
			.img-list li:not(:last-child) {
				margin-bottom: 9px;
			}
			/*设置图片的大小*/
			
			.img-list img {
				width: 100%;
			}
		</style>
	</head>

	<body>
		<ul class="img-list">
			<li>
				<a href="javascript:;"><img src="img/1.jpg" alt="" /></a>
			</li>
			<li>
				<a href="javascript:;"><img src="img/2.jpg" alt="" /></a>
			</li>
			<li>
				<a href="javascript:;"><img src="img/3.jpg" alt="" /></a>
			</li>
		</ul>
	</body>

</html>